* {
  margin: 0;
  padding: 0;
}
body, html {
  height:100%;
}

.low-bg {
  background-image: url(../../image/low/low-bg.png);
  height: 100vh;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  .open-config {
    position: absolute;
    top: 3%;
    right: 5%;
    color: white;
    font-size: 14px;
  }
  // ������ư�
  .configPanel {
    .config {
      background: #FFFFFF;
      width: 92%;
      height: 84%;
      position: absolute;
      top: -8%;
      left: 0;
      bottom: 0;
      right: 0;
      margin: auto;
      z-index: 1;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
      overflow: scroll;
      .close {
        display: block;
        width: 18px;
        height: auto;
        position: fixed;
        top: 35px;
        right: 25px;
      }
      .config-unit {
        margin: 5% 0;
        list-style-type: none;
        font-size: 14px;
        .config-formula {
          display: block;
          padding-left: 5%;
          padding-right: 5%;
          text-align: left;
          font-size: 12px;
          color: #eb6100;
          margin-top: 20px;
          p {
            margin: 10px;
          }
        }
        .config-title {
          display: block;
          text-align: center;
          vertical-align: middle;
          .config-label {
            font-size: 18px;
          }
        }
        .config-control {
          display: block;
          vertical-align: middle;
          .math-params {
            text-align: left;
            padding-left: 24px;
            padding-right: 24px;
            margin-bottom: 5%;
            padding-top: 15px;
            .cal-btn {
              background: #eb6100;
              color: white;
              font-size: 18px;
              width: 80%;
              height: 42px;
              line-height: 42px;
              text-align: center;
              margin: 20px auto;
              -webkit-border-radius: 5px;
              -moz-border-radius: 5px;
              border-radius: 5px;
            }
            .unit-select {
              margin: 10px 0;
              label:first-child {
                margin-right: 10px;
              }
            }
          }
        }
      }
      .btn-div {
        text-align: center;
        .confirm {
          display: inline-block;
          background: #eb6100;
          color: white;
          font-size: 14px;
          width: 80%;
          height: 38px;
          line-height: 38px;
          text-align: center;
          margin: 30px auto 15px auto;
          padding: 0;
          border: none;
          -webkit-border-radius: 5px;
          -moz-border-radius: 5px;
          border-radius: 5px;
        }
      }
      .input-field {
        .isOpen {
          height: auto;
        }
      }
    }
  }
  .low-img {
    display: block;
    margin: 0 auto;
    width: auto;
    height: 39vh;
    position: relative;
    top: 5vh;
  }
  .param-div {
    position: absolute;
    top: 47%;
    left: 0;
    right: 0;
    overflow: scroll;
    height: 39vh;
    .config-unit {
      background: rgba(255, 255, 255, 0.1);
      width: 92vw;
      height: 40px;
      margin: 5px auto;
      color: white;
      font-size:12px;
      position: relative;
      .config-title {
        display: inline-block;
        vertical-align: super;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        padding-left: 30px;
      }
      .config-control {
        display: inline-block;
        vertical-align: middle;
        float: right;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        margin-right: 30px;
        right: 10px;
      }
    }
  }
}



@media (max-height :680px) and (min-width: 413px) {

}
